﻿@import "float.css";

/* 레이아웃 */
#wrap {
	width: 1050px;
	margin: 0px auto;
	position: relative;
	/* font-size: 15pt; */
	font: 20px/100% Arial, Helvetica, sans-serif; 
	/* font-family: Helvetica; */
	/* 기준점이 없으면, 다 따로 놀아 */
	color: #fff;
	background: #000;
}

#header, #footer {
	text-align: center;
	height: 100px;
	padding: 10px 0px;
	color: #fff;
}

#sidebar {
	margin: 30px 0px;
	width: 250px;
	height: 850px;
	color: #fff;
}

/* --------------------- body.jsp ----------------------------------- */
#content {
	margin: 30px 0px;
	width: 799px;
	height: 850px;
	border-right: 1px solid #fff;
	color: #fff;
}

#category, #searchBox{
	text-align: cetner;
	position: relative;
	width: 650px;
	margin: 10px auto;
	padding: 10px 10px;
	height: 20px;
}

#category a{
	align: center;
	font: 14px/100% Arial, Helvetica, sans-serif; 
	color: #fff;
}

.logo{
	 width: 650px;
	 height: 90px;
}


a{
	color: #000;
	display: #fff;
	margin: 5px 0px;
	font: 12px/100% Arial, Helvetica, sans-serif;
	text-decoration:none;
}
/* ------------------------------------------------------------------- */

/* --------------------- main.jsp ----------------------------------- */

.ticket{
	width: 350px;
	height: 245px;
	margin: 10px 10px;
	/* color: #000; */
	border:1px solid #fff;
	border-radius: 1em;
	color: #fff;
	float: left;
}

.ticketName, .ticketDay, .price, #discountPrice, #discountNumber, .day{
	text-align: center;
}

.state{ font-size: 12px; }

.discountNumber, .infoDiscountNumber, #buyDiscountNumber{ 
	font-size: 14px; padding: 0px 15px; text-align: left;
}

.current, .state, #buyState, #buyCurrent, #infoState, #infoCurrent{ text-align: right; }

.ticketTotal, #buyTicketTotal, #infoTicketTotal{ text-align: left; }

.price, #buyPrice, #infoPrice{ text-decoration: line-through; }

.discountPrice, .current, #infoDiscountPrice, #buyDiscountPrice, #buyCurrent, #infoCurrent{ color: red; }

.numBox{
	background: #fff;
	width: 150px;
	height: 20px;
}

.ticketNumBox{
	margin: 10px 15px;
	width: 200px;
	height: 20px;
	background-color: none;
	border: 1px solid #fff;
}

img {
	width: 100px;
	height: 100px;
	margin: 10px 10px;
	align: left;
	padding: 5px 5px;
}


/* button */
.button {
	display: inline-block;
	zoom: 1; /* zoom and *display = ie7 hack for display:inline-block */
	display: inline;
	vertical-align: baseline;
	margin: 5px 2px;
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	font: 14px/100% Arial, Helvetica, sans-serif;
	padding: .5em 2em .55em;
	text-shadow: 0 1px 1px rgba(0,0,0,.3);
	-webkit-border-radius: .5em; 
	-moz-border-radius: .5em;
	border-radius: .5em;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
.button:hover {
	text-decoration: none;
}
.button:active {
	position: relative;
	top: 1px;
}

.bigrounded {
	-webkit-border-radius: 2em;
	-moz-border-radius: 2em;
	border-radius: 2em;
}
.medium {
	font-size: 12px;
	padding: .4em 1.5em .42em;
}
.small {
	font-size: 11px;
	padding: .2em 1em .275em;
}

/* white */
.white {
	color: #606060;
	border: solid 1px #b7b7b7;
	background: #fff;
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed));
	background: -moz-linear-gradient(top,  #fff,  #ededed);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed');
}
.white:hover {
	background: #ededed;
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#dcdcdc));
	background: -moz-linear-gradient(top,  #fff,  #dcdcdc);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dcdcdc');
}
.white:active {
	color: #999;
	background: -webkit-gradient(linear, left top, left bottom, from(#ededed), to(#fff));
	background: -moz-linear-gradient(top,  #ededed,  #fff);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#ffffff');
}

/* button */

/* ---------------------------------------------------------------------------------- */

/* ----------------------------------- ticketInfo & BUY.jsp -----------------------------------  */
#buyBox, #infoBox{
	width: 550px;
	height: 300px;
	margin: 10px 50px;
	padding: 20px 20px;
	color: #fff;
	border:1px solid #fff;
	float: center;
	border-radius: 1em;
	font: 23px/100% Arial, Helvetica, sans-serif;
}

#buyBox table td img , #infoBox table td img{
	width: 220px;
	height: 170px;
	margin: 10px 10px;
	float: left;
	padding: 5px 5px;
}

#buyTicketNumBox, #infoTicketNumBox{
	margin: 5px 15px;
	width: 350px;
	height: 20px;
	background-color: none;
	border: 1px solid #fff;
}

.buyNumBox, .infoNumBox{
	background: #fff;
	width: 250px;
	height: 20px;
}

#buyTicketNum{
	border: 0px;
	text-align: right;
	margin: 0px 110px;
	padding: 30px 0px 0px;
}
#ticketBuyList p{ margin: 10px 80px; text-align: left; font-size: 14px;}

#ticketList{
	width: 570px;
	text-align: center;
	margin: 10px 50px;
	padding: 10px 10px;
	border: 1px solid #fff;
}

#ticketList table{
	width: 570px;
}

#ticketList td{
	padding: 0px 7px
}
#buyOkBtn{
	width: 100px;
	margin: 10px 0px 0px 530px;
	padding: 10px 10px;
}


/* ---------------------------------------------------------------------------------- */

/* ----------------------------------- ticketInfo.jsp ----------------------------------- */


#ticketInformation{
	margin: 5px 10px;
	padding: 5px;
	width: 770px;
	height: 430px;
	/* border: 1px solid #fff; */
}

#Information{
	float:left;
	margin: 10px 20px;
	padding: 0px 10px;
	width: 250px;
	height: 400px;
	/* border: 1px solid #fff; */
}

#map{
	float:left;
	margin: 30px 10px;
	padding: 0px 10px;
	width: 400px;
	height: 400px;
	/* border: 1px solid #fff; */
}

div.infowindow {
	max-height: 250px;
	over-flow-y:auto;
}

/* ------------------------------------------  buylist  ------------------------------------ */

#buyListTable{
	font: 22px/100% Arial, Helvetica, sans-serif; 
	text-align: center;
	margin: 10px 60px;
	padding: 10px 20px;
	width: 600px;
	float: center;
	border: 1px solid #fff;
}

#buyListTable td{
	padding: 0px 10px
}

#couponLable{ 
	margin: 0px 20px;
	padding: 0px 0px;
	font-size: 14px;
	text-align: right;
}
#coupon{ font-size: 14px; text-align: left; }

#nickName{
	font: 22px/100% Arial, Helvetica, sans-serif; 
	margin: 20px 20px;
	padding: 10px 10px;
}

#buyTicket{
	width: 330px;
	height: 160px;
	margin: 10px 10px;
	text-align: center;
	/* color: #000; */
	border:1px solid #fff;
	border-radius: 1em;
	color: #fff;
	float: center;
}

/* ----------------------------------------------------------------------------------*/

/* ----------------------------- join.jsp & idSearch.jsp ------------------------- */

.joinTable, .idSearchTable{
	font: 16px/100% Arial, Helvetica, sans-serif; 
	margin: 20px 20px;
	padding: 10px 5px;
	float: center;
}

.joinTable input, .idSearchTable input{
	margin: 5px 5px;
	padding: 5px 5px;
}

#region{
	width: 160px;
	font: 16px/100% Arial, Helvetica, sans-serif; 
	float: right;
	font: 16px/100% Arial, Helvetica, sans-serif; 
	margin: 5px 5px;
	padding: 5px 5px;
}

.join{
	margin: 0px 0px 80px 20px;
}

.join, .clear{
	width: 80px;
	float:center
}

#idSearchBox tr{
	padding 20px 0px;	
}

/* --------------------------------     buyOk.jsp       ------------------------------*/

#buyOkTable{
	font: 18/100% Arial, Helvetica, sans-serif;
	text-align: center;
}

/* -----------------------------      login/out.jsp    -------------------------------*/

#logOutBox, #logInBox{
	margin: 10px 10px;
	width: 200px;
	height: 155px;
	padding: 20px 10px;
	border:1px solid #fff;
	font: 16px/100% Arial, Helvetica, sans-serif;
}

#logInBox p{
	margin: 2px 2px;
	padding: 5px 3px;
	font-size: 18px;
	line-height:160%;
}

#idpwSearchBtn{
	width: 150px;

}

/* ----------------------------------------------------------------------------------*/

/* ----------------------------------- coupon.jsp -----------------------------------  */
#buyTicket{
	width: 550px;
	height: 220px;
	margin: 10px 50px;
	padding: 10px 10px;
	color: #fff;
	border:1px solid #fff;
	text-align: center;
	border-radius: 1em;
	float: left;
	font: 23px/100% Arial, Helvetica, sans-serif;
}

#buyTicket table td img {
	width: 220px;
	height: 170px;
	margin: 10px 10px;
	float: left;
	padding: 5px 5px;
}

#buyTicket #ticketName{ font-size: 25px;}

#buyTicket #couponLable{ 
	margin: 0px 20px;
	padding: 0px 0px;
	font-size: 18px;
	text-align: right;
}
#buyTicket #coupon{ font-size: 18px; text-align: right; }

/* ----------------------------------------------------------------------------------*/

/* color */
#header {
	/* background: #7078b2; */
}
#content {
	/* background:  #bac2ff; */
}
#sidebar {
	/* background: #9ecc80; */
}
#footer {
	/* background: #7078b2; */
}